<template>
  <div>
    <alarmTrend class="h-full" :data="data" :dataList="dataList" :title="title" :legendList="legendList"
      :color="colors" />
  </div>
</template>
<script lang="ts" setup>

import alarmTrend from "@/views/large-data-screen/component/public/alarm-trend.vue"
import { supervisealarmstate, } from '@/api/screen/largeData'
const legendList = ref(['故障', '离线', '报警'])
const colors = ref(['rgb(69, 131, 255)', 'rgb(253, 188, 82)', 'rgb(1, 191, 236)',])
const title = ref('近15日告警态势')
//用于控制图表样式
const data = ref(
  [
    // { left: '10px', top: '30px', width: '95%', height: '140px', },
    { left: '10px', right: '10px', width: '95%', bottom: '20px' },
    { height2: '200px' }
  ]
)
//获取图表数据
const dataList = ref([])
onMounted(() => {
  getcountalarm()
})
//近7日告警态势
const getcountalarm = () => {
  supervisealarmstate().then(res => {
    dataList.value = res.result
  })
}

</script>
